import React,{Component} from 'react';
import { CommonBlock } from './CommonBlock'
import { NewsCard } from './NewsCard'
import { NoticCard } from './NoticCard'
import  JobItem  from './JobItem'
import '../../../../../style/component/HotDataBlock.less' 

class HotDataBlock extends Component {
    constructor(props){
        super(props);
        this.state={
            hotdatas:[]
        }
    }
     //生命周期函数，组件第一次被渲染到Dom中，mount(挂载)
     componentDidMount() {
        const data={
            code:'200',
            rows:
                [ {'name':'全部工作','type':1,'row':[
                    [{'id':1,'name':'人口库','bgClass':'iconGreen','tuClass':'iconqunzu','url':'renkoulu'},
                     {'id':2,'name':'法人库','bgClass':'iconRed','tuClass':'iconshiwu-chuizi','url':'farenku'},
                     {'id':3,'name':'清洗','bgClass':'iconYellow','tuClass':'iconguanli1','url':'qingxi'},
                     {'id':4,'name':'项目管理','bgClass':'iconBlue','tuClass':'iconwendang1','url':'xiangmuguanli'}
                    ],
                    [{'id':5,'name':'普查','bgClass':'iconBlue','tuClass':'iconcz-wenjianzc','url':'pucha'},
                     {'id':6,'name':'开放','bgClass':'iconGreen','tuClass':'icondiqiu','url':'kaifang'},
                     {'id':7,'name':'目录','bgClass':'iconRed','tuClass':'iconshuju6','url':'mulu'},
                     {'id':8,'name':'交换','bgClass':'iconYellow','tuClass':'iconzhuanhuan','url':'jiaohuan'}
                    ],
                    [{'id':9,'name':'经济运行','bgClass':'iconRed','tuClass':'iconerji-yingyongyunhangbaobiao','url':'jingjiyunxing'},
                     {'id':10,'name':'信用库','bgClass':'iconYellow','tuClass':'iconxin','url':'xinyongku'},
                     {'id':11,'name':'证照库','bgClass':'iconGreen','tuClass':'icondianzizhengzhao','url':'zhengzhaoku'},
                     {'id':12,'name':'共享','bgClass':'iconBlue','tuClass':'icontubiaoshu','url':'gongxiang'}
                    ]
                ]},
                {'name':'公告','type':2,'row':[
                    {'id':1,'title':'省人力社保厅召开“不忘初心、牢记使命”主题教育专项整治工作部署会','footer':'浙江省人力资源和社会保障网','time':'2019-08-02',tu:'../../../../../image/timg.jpg'},
                    {'id':2,'title':'全省系统深化“最多跑一次”改革“领跑者”（金华）综合试点周例会在杭州召开','footer':'厅跑改办 ','time':'2019-08-02',tu:'../../../../../image/timg.jpg'},
                    {'id':3,'title':'全省人力社保系统深化“最多跑一次”改革“领跑者”（金华）综合试点工作在金华启动','footer':'厅跑改办 宣传中心 ','time':'2019-07-25',tu:'../../../../../image/timg.jpg'}
                ]},
                {'name':'新闻动态','type':3,'row':[
                    {'id':1,'title':'浙江"双创"热潮涌动，"最多跑一次"为目标的商事制度改革','content':'当天下午2时，走进青浦区行政服务中心，长三角一体',tu:'../../../../../image/timg.jpg'},
                    {'id':2,'title':'浙江"双创"热潮涌动，"最多跑一次"为目标的商事制度改革','content':'当天下午2时，走进青浦区行政服务中心，长三角一体',tu:'../../../../../image/timg.jpg'},
                    {'id':3,'title':'浙江"双创"热潮涌动，"最多跑一次"为目标的商事制度改革','content':'当天下午2时，走进青浦区行政服务中心，长三角一体',tu:'../../../../../image/timg.jpg'}
                ]},
                {'name':'精选案例','type':3,'row':[
                    {'id':1,'title':'全国首家政务服务标准化培训基地落户台州','content':'2月25日下午，由中国标准化协会同意筹建的政务服务标准化培训实践基地，在台州举行授牌仪式。',tu:'../../../../../image/timg.jpg'},
                    {'id':2,'title':'全国首家政务服务标准化培训基地落户台州','content':'2月25日下午，由中国标准化协会同意筹建的政务服务标准化培训实践基地，在台州举行授牌仪式。',tu:'../../../../../image/timg.jpg'},
                    {'id':3,'title':'全国首家政务服务标准化培训基地落户台州','content':'2月25日下午，由中国标准化协会同意筹建的政务服务标准化培训实践基地，在台州举行授牌仪式。',tu:'../../../../../image/timg.jpg'}
                ]}
            ]
        };
        const hotdatas = data.rows.map((obj) => 
            <CommonBlock blockName={obj.name} key={obj.name}>
                {
                    obj.type === 1 ?
                        <div className="allJob">
                            <div className="jobTabs">
                                {obj.row.map((son) => 
                                    <JobItem key={son[0].id} job={son}></JobItem>
                                )}
                            </div>
                        </div> 
                    : obj.type === 2 ?
                        <div style={{marginTop:"10px"}} >
                                {obj.row.map((son) => 
                                    <NoticCard key={son.id} notice={son}></NoticCard>
                                )}
                        </div>
                    :
                        <div style={{marginTop:"10px"}} >
                                {obj.row.map((son) => 
                                    <NewsCard key={son.id} news={son}></NewsCard>
                                )}
                        </div>
                }
            </CommonBlock>
        ); 
        this.setState({hotdatas:hotdatas});
    }
    render(){
        return (
            <div>
                {this.state.hotdatas}
            </div>
        )
    }
}
export {HotDataBlock}